Add skeleton loaders and empty state handling to tracker dashboard by priya434960 · Pull Request #559 · GitMetricsLab/github_tracker

priya434960 · 2026-05-27T04:54:50Z

Related Issue

Closes: Tracker Dashboard Feels Unresponsive During Data Fetch — Add Skeleton UI and Empty States #534

Description

Implemented improved loading and empty-state UI for the tracker dashboard.

How Has This Been Tested?

-Tested locally on localhost
-Verified Skeleton loader appears during data fetch
-Verified empty-state message appears correctly
-Verified tracker page still works normally

Screenshots

Type of Change

Bug fix

Summary by CodeRabbit

New Features
- Enhanced loading experience with skeleton placeholder rows providing better visual feedback during data fetch, replacing the previous spinner interface.
- Added empty state notification displaying a message when no GitHub activity matches the currently applied filter criteria.

netlify · 2026-05-27T04:54:54Z

✅ Deploy Preview for github-spy ready!

Name	Link
🔨 Latest commit	`7b08c26`
🔍 Latest deploy log	https://app.netlify.com/projects/github-spy/deploys/6a167f162450af00082a990b
😎 Deploy Preview	https://deploy-preview-559--github-spy.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

coderabbitai · 2026-05-27T04:55:02Z

Warning

Review limit reached

@priya434960, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 34 minutes and 30 seconds. Learn how PR review limits work.

Your organization has run out of usage credits. Purchase more in the billing tab.

⌛ How to resolve this issue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available.

Please see our Fair Usage Limits Policy for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 3842a9ae-d5d7-4cb4-8f3c-38d4856f434f

📥 Commits

Reviewing files that changed from the base of the PR and between fe47d63 and 7b08c26.

📒 Files selected for processing (1)

src/pages/Tracker/Tracker.tsx

📝 Walkthrough

Walkthrough

The Tracker component now provides visual feedback during data loading and when no results are found. A MUI Skeleton import is added, the loading state renders animated skeleton rows instead of a centered spinner, and an empty-state message appears when the filtered dataset is empty.

Changes

Loading and Empty-State UX Improvements

Layer / File(s)	Summary
Loading and empty-state UI `src/pages/Tracker/Tracker.tsx`	Skeleton import is added; loading state renders multiple stacked skeleton rows for visual feedback instead of a blank spinner; empty table displays a "No Github activity found with current filters." row when no data matches the current filters.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related issues

#534: Tracker Dashboard Feels Unresponsive During Data Fetch — Add Skeleton UI and Empty States. This PR directly implements the skeleton loader placeholders and empty-state message improvements described in the issue.

Possibly related PRs

GitMetricsLab/github_tracker#246: Both PRs modify src/pages/Tracker/Tracker.tsx to replace the loading spinner with MUI Skeleton-based skeleton table rows.
GitMetricsLab/github_tracker#242: Both PRs modify src/pages/Tracker/Tracker.tsx to replace the loading CircularProgress spinner with Skeleton placeholders and add empty-state rendering.

Suggested labels

level:intermediate, quality:clean

Poem

🐰 A spinner once spun, now skeletons dance,
Placeholders shimmer while data takes chance,
Empty states whisper with grace and with care,
"No activity here, but we're standing right there!"
The dashboard feels swift, responsive and bright,
Loading feels lighter—the UX feels right! ✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and specifically describes the main changes: adding skeleton loaders and empty state handling to the tracker dashboard, which aligns with the core modifications in the PR.
Description check	✅ Passed	The description follows the template structure with all required sections (Related Issue, Description, How Has This Been Tested, Screenshots, Type of Change) mostly complete, though some minor formatting issues exist.
Linked Issues check	✅ Passed	The PR successfully implements the requirements from issue `#534`: skeleton loaders for loading states, empty-state message ('No Github activity found with current filters'), improved visual feedback, and responsive UX for the tracker dashboard.
Out of Scope Changes check	✅ Passed	All changes are focused on frontend UX improvements for loading and empty states in the Tracker component, staying within the scope defined by issue `#534` with no unrelated modifications.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

github-actions

🎉 Thank you @priya434960 for your contribution. Please make sure your PR follows https://github.com/GitMetricsLab/github_tracker/blob/main/CONTRIBUTING.md#-pull-request-guidelines

coderabbitai

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/pages/Tracker/Tracker.tsx`:
- Line 376: The empty-state message in the Tracker component contains incorrect
product casing: replace the string "No Github activity found with current
filters." with "No GitHub activity found with current filters." in the
JSX/return of the Tracker component (look for the exact literal in Tracker.tsx)
so user-facing copy uses the official "GitHub" casing.
- Around line 373-379: The empty-state message is shown based only on
currentFilteredData.length === 0; update the condition to also require that a
fetch has been executed (e.g., check a "hasFetched" or similar flag) so the
message only displays after at least one fetch completes; if no flag exists, add
a local state like hasFetched in the Tracker component (set it true when the
fetch action or the function that loads data completes) and change the render
condition around the TableRow/TableCell to currentFilteredData.length === 0 &&
hasFetched (or equivalent) to avoid showing the message on initial load.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

Push a commit to this branch (recommended)
Create a new PR with the fixes

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 8cbb99c2-e3ee-4bbd-8b44-46c19493a2dd

📥 Commits

Reviewing files that changed from the base of the PR and between 4ae0ef6 and fe47d63.

📒 Files selected for processing (1)

src/pages/Tracker/Tracker.tsx

priya434960 · 2026-05-30T05:07:42Z

Hi, I have addressed the review comments and pushed the required fixes. If there are any additional changes needed, please let me know. Thank you!

priya434960 added 2 commits May 26, 2026 12:35

Add skeleton loading state for tracker table

2b7708a

Improve tracker loading and empty state UX

fe47d63

github-actions Bot added gssoc:approved level:intermediate quality:clean type:accessibility labels May 27, 2026

github-actions Bot reviewed May 27, 2026

View reviewed changes

coderabbitai Bot reviewed May 27, 2026

View reviewed changes

Comment thread src/pages/Tracker/Tracker.tsx

Comment thread src/pages/Tracker/Tracker.tsx Outdated

Fix empty state visibility and GitHub casing

7b08c26

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add skeleton loaders and empty state handling to tracker dashboard#559

Add skeleton loaders and empty state handling to tracker dashboard#559
priya434960 wants to merge 3 commits into
GitMetricsLab:mainfrom
priya434960:feature/tracker-loading-empty-state

priya434960 commented May 27, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

netlify Bot commented May 27, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot commented May 27, 2026 •

edited

Loading

Review limit reached

Walkthrough

Changes

Estimated code review effort

Possibly related issues

Possibly related PRs

Suggested labels

Poem

Uh oh!

github-actions Bot left a comment

Uh oh!

coderabbitai Bot left a comment

Uh oh!

Uh oh!

Uh oh!

priya434960 commented May 30, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Conversation

priya434960 commented May 27, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Related Issue

Description

Implemented improved loading and empty-state UI for the tracker dashboard.

How Has This Been Tested?

-Tested locally on localhost -Verified Skeleton loader appears during data fetch -Verified empty-state message appears correctly -Verified tracker page still works normally

Screenshots

Type of Change

Summary by CodeRabbit

Uh oh!

netlify Bot commented May 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for github-spy ready!

Uh oh!

coderabbitai Bot commented May 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review limit reached

Walkthrough

Changes

Estimated code review effort

Possibly related issues

Possibly related PRs

Suggested labels

Poem

Uh oh!

github-actions Bot left a comment

Choose a reason for hiding this comment

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

priya434960 commented May 30, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

priya434960 commented May 27, 2026 •

edited by coderabbitai Bot

Loading

-Tested locally on localhost
-Verified Skeleton loader appears during data fetch
-Verified empty-state message appears correctly
-Verified tracker page still works normally

netlify Bot commented May 27, 2026 •

edited

Loading

coderabbitai Bot commented May 27, 2026 •

edited

Loading